<template>
	<view>
		<navbar title="场所列表" :back="true"></navbar>
		<view>
			<view style="position: fixed;z-index: 20000;left: 0;width: 100%;background:linear-gradient(to right,rgba(235, 216, 250, 0.99)5%,rgba(175, 177, 251, 1)95%);padding-top: 20rpx;" :style="{top:`${rect.bottom+7}px`}">
				<view style="border-radius: 26rpx;padding:0 20rpx;margin: 0 40rpx;">
					<view style="background-color: rgba(167, 167, 167,.2);border-radius: 26rpx;">
						<u-search placeholder="请输入搜索内容"  :showAction='false'  v-model="params.keyword"  height='60' bgColor='transparent' color='#000' placeholderColor='#000' searchIconColor='#000'
							@search="search()">
						</u-search>
					</view>
				</view>
				<view style="margin-top: 20rpx;">
					 <cc-dropDownMenu :titleArr="titleArr" :dropArr="dropArr" @finishDropClick="finishClick" bgcolor='transparent' :dataShow='show'></cc-dropDownMenu>
				</view>
			</view>
			<view style="height: 200rpx;"></view>
			<view style="padding:20rpx;">
				 <view v-for="(item,index) in list" :key="index" style="background-color: #fff;padding: 20rpx;border-radius: 20rpx;margin-bottom: 20rpx;" v-if="list.length!=0">
				 	 <view style="display: flex;align-items: center;">
						 <view class="">名称:</view>
						 <view style="margin-left: 18rpx;font-size: 28rpx;">{{item.name}}</view>
				 	 </view>
				 	 <view style="display: flex;margin: 20rpx 0;align-items: center;">
						 <view style="width: 90rpx">地址:</view>
						 <view style="font-size: 28rpx;">{{item.province + item.city + item.district + item.address}}</view>
				 	 </view>
				 </view>
				<view v-if='list.length==0'>
					<u-empty 
					        mode="list"
					        icon="http://cdn.uviewui.com/uview/empty/list.png"
							text='列表为空'
					>
					</u-empty>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import navbar from "@/components/baseNavbar.vue"
	import {
		getSelelist
	} from "@/api/make.js"
	export default{
		components:{
			navbar
		},
		data(){
			return{
				titleArr:['省','市','区'],
				show:false,
				dropArr:[
					[],
					[],
					[]
				],
				list:[],
				params:{
					keyword:'',
					page:1,
					limit:10,
					province:'',
					city:'',
					district:'',
					load:true
				}
			}
		},
		onLoad(){
			this.resetList()
		},
		methods:{
			search(){
				this.resetList()
			},
			finishClick(e){
				this.params.province = e[0]
				this.params.city = e[1]
				this.params.district = e[2]
				this.resetList()
			},
			resetList() {
				this.params.page = 1
				this.list=[]
				this.getList()
			},
			getList() {
				if (!this.params.load) {
					return;
				}
				this.params.load = false;
				getSelelist(this.params).then(res => {
					this.params.page++
					this.list = this.list.concat(res.data.list)
					this.params.load = true
				})
			
			},
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #f6f6f6;
		height: 100%;
	}
</style>